<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,aItemress=no">
    <title>AUI快速完成布局</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
</head>
<body>
    <section class="aui-content-padded">
        <h1>标题一 H1</h1>
        <h2>标题二 H2</h2>
        <h3>标题三 H3</h3>
        <h4>标题四 H4</h4>
        <h5>标题五 H5</h5>
        <h6>标题六 H6</h6>
        <p>P标签字体，默认为14px</p>
        <div class="aui-content">
            内容区域，AUI 2.0色彩及尺寸按照Material Design标准设计
        </div>
    </section>
    <section class="aui-content">
        <ul class="aui-list">
            <li class="aui-list-header">
                常用颜色值对应
            </li>
            <li class="aui-list-item">
                <div class="aui-list-item-inner">
                    <div class="aui-list-item-title aui-text-primary">primary</div>
                    <div class="aui-list-item-right">#00bcd4</div>
                </div>
            </li>
            <li class="aui-list-item">
                <div class="aui-list-item-inner">
                    <div class="aui-list-item-title aui-text-success">success</div>
                    <div class="aui-list-item-right">#009688</div>
                </div>
            </li>
            <li class="aui-list-item">
                <div class="aui-list-item-inner">
                    <div class="aui-list-item-title aui-text-info">info</div>
                    <div class="aui-list-item-right">#03a9f4</div>
                </div>
            </li>
            <li class="aui-list-item">
                <div class="aui-list-item-inner">
                    <div class="aui-list-item-title aui-text-warning">warning</div>
                    <div class="aui-list-item-right">#ffc107</div>
                </div>
            </li>
            <li class="aui-list-item">
                <div class="aui-list-item-inner">
                    <div class="aui-list-item-title aui-text-danger">danger</div>
                    <div class="aui-list-item-right">#e51c23</div>
                </div>
            </li>
        </ul>
    </section>
</body>
<script type="text/javascript" src="../script/api.js" ></script>
<script type="text/javascript">
    apiready = function(){
        api.parseTapmode();
    }

</script>
</html>